require("../../assets/css/index.less");
require("./register.less");
require("../../assets/fonts_two/iconfont")
const axios = require("axios");
const CaptchaMini = require("../../assets/lib/captcha-mini/captcha-mini");
require('../../utils/https');
axios.defaults.headers.common['Authorization'] = "Bearer " + localStorage.getItem("token");

let captcha2 = new CaptchaMini({
    lineWidth: 1, //线条宽度
    lineNum: 6, //线条数量
    dotR: 2, //点的半径
    dotNum: 25, //点的数量
    preGroundColor: [10, 80], //前景色区间
    backGroundColor: [150, 250], //背景色区间
    fontSize: 20, //字体大小
    fontFamily: ['Georgia', '微软雅黑', 'Helvetica', 'Arial'], //字体类型
    fontStyle: 'stroke', //字体绘制方法，有fill和stroke
    content: '1234567890', //验证码内容
    length: 4 //验证码长度
});

let code = "";
captcha2.draw(document.querySelector('#captcha2'), r => {
    console.log(r);
    code = r;
});

function $(a) {
    return document.querySelector(a);
}

function $$(a) {
    return document.querySelector(a);
}

$(".head").addEventListener("click", () => {
    console.log(1);
    location.href = "login.html";
});

let ipone = /^[1][3-9][0-9]{9}$/;

$("#iponecode").addEventListener("blur", function() {
    console.log($("#iponecode").value);
    if (!ipone.test($("#iponecode").value)) {
        $("#iponecode").style.color = "red";
        $("#iponecode").value = "请输入正确的手机号码";
    } else {
        $("#iponecode").style.color = "#fff";
        $("#iponecode").value = $("#iponecode").value;
    }
});

$("#iponecode").addEventListener("click", function() {
    if ($("#iponecode").style.color != "red") {
        $("#iponecode").value = $("#iponecode").value
    } else {
        $("#iponecode").style.color = "#fff";
        $("#iponecode").value = "";
        $("#iponecode").placeholder = "";
    }
});


$(".code").addEventListener("blur", function() {
    console.log(code);
    if ($(".code").value !== code) {
        $(".code").style.color = "red";
        $(".code").value = "验证码错误";
    } else {
        $(".code").style.color = "#fff";
        $(".code").value = $(".code").value;
    }
});

$(".code").addEventListener("click", function() {
    if ($(".code").style.color != "red") {
        $(".code").value = $(".code").value
    } else {
        $(".code").style.color = "#fff";
        $(".code").value = "";
        $(".code").placeholder = "";
    }
});

const pwd = /^[a-zA-Z0-9]{6,12}$/;
$(".pwd").addEventListener("blur", function() {
    console.log($(".pwd").value);
    if (!pwd.test($(".pwd").value)) {
        $(".pwd").style.color = "red";
        $(".pwd").value = "请输入6-12位密码";
    } else {
        $(".pwd").style.color = "#fff";
        $(".pwd").value = $(".pwd").value;
    }
});

$(".pwd").addEventListener("click", function() {
    if ($(".pwd").style.color != "red") {
        $(".pwd").value = $(".pwd").value
    } else {
        $(".pwd").style.color = "#fff";
        $(".pwd").value = "";
        $(".pwd").placeholder = "";
    }
});

$(".truepwd").addEventListener("blur", function() {
    if ($(".pwd").value !== $(".truepwd").value) {
        $(".truepwd").style.color = "red";
        $(".truepwd").value = "两次密码不一致请重新输入";
    } else {
        $(".truepwd").style.color = "#fff";
        $(".truepwd").value = $(".truepwd").value;
    }
});

$(".truepwd").addEventListener("click", function() {
    if ($(".truepwd").style.color != "red") {
        $(".truepwd").value = $(".truepwd").value
    } else {
        $(".truepwd").style.color = "#fff";
        $(".truepwd").value = "";
        $(".truepwd").placeholder = "";
    }
});

$("#btn").addEventListener("click", () => {
    if (ipone.test($("#iponecode").value) && pwd.test($(".pwd").value) && $(".pwd").value === $(".truepwd").value && $(".code").value === code) {
        // console.log(1);
        const fn = async function(account, password) {
            const res = await axios.post("/api/user/register", {
                "account": account,
                "password": password,
            });
            // console.log(res.data);
            if (res.data.errno === 0) {
                $(".box").classList.remove("none");
                setInterval(() => {
                    location.href = "/login.html";
                }, 3000)
            } else {
                $(".box_two").classList.remove("none");
                setInterval(() => {
                    $(".box_two").classList.add("none");
                }, 3000)
            }
        }
        fn($("#iponecode").value, $(".pwd").value)
    }
})